import type { ButtonThemeVarBaseConfig, ButtonThemeVarConfig } from './types'
import { ThemeElement, ThemeProperty, ThemeState } from '../../types'
import { BaseThemeVarService } from '../base'

export class ButtonThemeVarService extends BaseThemeVarService {
  private static instance: ButtonThemeVarService

  static getInstance(): ButtonThemeVarService {
    if (!ButtonThemeVarService.instance) {
      ButtonThemeVarService.instance = new ButtonThemeVarService()
    }
    return ButtonThemeVarService.instance
  }

  get default(): ButtonThemeVarConfig {
    return {
      follow: this.follow,
    }
  }

  get follow(): ButtonThemeVarBaseConfig {
    return {
      text: this.varMapper.getVarName({
        element: ThemeElement.Button,
        subElement: 'follow',
        property: ThemeProperty.Text,
      }),
      textHover: this.varMapper.getVarName({
        element: ThemeElement.Button,
        subElement: 'follow',
        property: ThemeProperty.Text,
        state: ThemeState.Hover,
      }),
      bg: this.varMapper.getVarName({
        element: ThemeElement.Button,
        subElement: 'follow',
        property: ThemeProperty.Bg,
      }),
      bgHover: this.varMapper.getVarName({
        element: ThemeElement.Button,
        subElement: 'follow',
        property: ThemeProperty.Bg,
        state: ThemeState.Hover,
      }),
    }
  }
}
